<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div class="container">
        dfafdfdsaf3424fdaf
        <div>hello343fdafda
            <div>fdafdsa34232fdafdsa

                <div>fdafd324dfafd
                    <div >fdsaf32432fdaf</div>
                </div>
            </div>
        </div>
        <!-- 我是注释 -->
    </div>
    <script>
        //     var containerEle = document.querySelector(".container");
        //    var nodes =  containerEle.childNodes;
        //     console.log( nodes[0]);
        //     nodes[0].nodeValue = "123";

        // 设置 container 容器里的文本 查找 里面的数字 替换成 *;
        // var str = "fdafdsa3424fdsafdsa";
        // var res = str.replace(/\d+/, "*");
        // console.log(res);


        // 需求： 把 contianer 容器 里的所有文本 里的数字换成 *;
        // 需要找到 容器里的文本节点 
        var containerEle = document.querySelector(".container");

        compileNode(containerEle)

        function compileNode(containerEle) {
            // 获取container 容器里的所有节点；
            var nodes = containerEle.childNodes;

            // 循环 所有的节点 然后把文本节点区分出来
            nodes.forEach(function (node) {
                // console.log(node);
                if (node.nodeType === 3) {  // 文本节点
                    // console.log("("+node.nodeValue+")");
                    // 去掉空格
                    var reg = /\s+/g;
                    // var str = "  fdadf  ";
                    // str.trim()
                    var nodeStr = node.nodeValue.replace(reg, "");
                    // console.log("("+nodeStr+")");
                    if (nodeStr !== "") {  // 只处理 文本节点里 有内容的节点；
                        // console.log(node);
                        // 把文本节点里的数字换成 * 
                        var reg2 = /\d+/g;
                        node.nodeValue = node.nodeValue.replace(reg2, "*");
                    }
                }else if(node.nodeType===1){
                    // 元素节点
                    console.log("元素是",node);
                    compileNode(node); // 递归查找节点
                }
            })
        }

        /* 
        难点
        1.正则  \s \d \w  + ? . [0-9] [a-z] ... g i 
        2.递归 : 深拷贝 无限极分类 
        */


    </script>
</body>

</html>